﻿FlyTalk.views.SearchResultsView = Ext.extend(Ext.Panel, {

  //  notesStore: Ext.emptyFn,
   // notesList: Ext.emptyFn,

    //layout: 'fit',
	scroll: true,
	title: 'search',
    initComponent: function () {

        this.searchButton = new Ext.Button({
            iconCls: 'search',
			iconMask: true,
            handler: this.onSearch,
            scope: this
        });
		
		this.composeButton = new Ext.Button({
            iconCls: 'compose',
			iconMask: true,
            handler: this.onCompose,
            scope: this
        });
		
		this.deleteButton = new Ext.Button({
            iconCls: 'delete',
			iconMask: true,
            handler: this.onDelete,
            scope: this
        });
		
			// Tweet toolbar
		this.tweetToolbar = new Ext.Toolbar({
			title: 'Results',
			doc: 'top',
			layout: 'hbox',
			items: [
				this.deleteButton,
				{xtype: 'spacer'},
				this.searchButton,
				this.composeButton,
			]
		});
		

        this.dockedItems = [this.tweetToolbar];
		
		//dummy store
		var store1 = new Ext.data.JsonStore({
				model : 'MixedPostModel',
		});
		
		
		// post store
		// not in PostStore.js because not sure how to instantiate a specific store in that class
		this.PostStore = new Ext.data.JsonStore({
			model : 'PostModel',
			autoLoad: true,

			proxy: {
          		type: 'scripttag',
          		url: 'http://search.twitter.com/search.json',
          		extraParams: {
             		q: 'Cleveland',
                	rpp: 2,
                	//suppress_response_codes: true
          		},
          		reader: {
                	type: 'json',
                	root: 'results'
         		}
    		},
			
		});
					
		this.tweetList = new Ext.List({
			fullscreen: true,
			//scroll: true,
			emptyText: '<div style="margin:5px;">No tweets cached.</div>',
			itemTpl : [ 
				//'<div id="tweet_container">',
				/*
                   '<tpl for=".">',
                        '<div class="tweet_data">',
                        	'<div class="tweet_avatar">',
                            	'<img width="30" height="30" src="{profile_image_url}"/>',
                       		'</div>',
                        	'<div class="tweet_content">',
                            	'<a class="user" href="http://twitter.com/{from_user}">{from_user}</a>&nbsp;',
                            	'{text}',
                       	 	'</div>',
                        	'<div class="clear"></div>',
                        '</div>',
                   '</tpl>',*/
                //'</div>'
				'<tpl for=".">',
                        '<div class="tweet_data">',
                        	'<div class="tweet_avatar">',
                            	'<img width="30" height="30" src="{image_url}"/>',
                       		'</div>',
                        	'<div class="tweet_content"><span style="color: blue">',
                            	'{from_user} {type}</span>&nbsp;',
                            	'{text} {date} {thread}[thread id] {up} [up] and {down} [down]',
                       	 	'</div>',
                        	//'<div class="clear"></div>',
                        '</div>',
				'</tpl>'
			],
			grouped : false,
			indexBar: false,
			//onItemDisclosure: true,
			store: this.PostStore,
			
			
			listeners:{
				itemTap: function(dv, index, tweet, evt){
					//alert(this.store.getAt(index));
					FlyTalk.views.SearchResultsView.onTweet(this.store.getAt(index).data);				
				},
			}
		});
		
		
		/*
	  	this.tweetList.on({
			scope: this,
			itemtap: this.onTweet,
		});*/
		
		/*
	  	this.tweetList.on('disclose', function (record, index, evt) {
            this.onTweet(record, index);
        }, this),*/
	
		this.items = [this.tweetList];
		
		FlyTalk.views.SearchResultsView.superclass.initComponent.call(this);

/*
         listeners:{
            itemtap: function(record, index){               
            ListDemo.detailPanel.update(record.data);
            ListDemo.Viewport.setActiveItem('detailpanel');
            }
        }
		
		this.notesList = new Ext.List({
            store: this.notesStore,
            grouped: true,
            emptyText: '<div style="margin:5px;">No notes cached.</div>',
            onItemDisclosure: true,
            itemTpl: '<div class="list-item-title">{title}</div>' +
                            '<div class="list-item-narrative">{narrative}</div>'

        });

        this.notesList.on('disclose', function (record, index, evt) {
            this.onEditNote(record, index);
        }, this),

        this.items = [this.notesList];
		*/

        
    },

    onSearch: function () {
        Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'openSearch'
        });
    },

    onCompose: function (record, index) {
        Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'openCompose',
        //    note: record
        });
    },
	
	 onTweet: function (tweet) {
        Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'openThread',
            post: tweet,
        });
    },
	
	onDelete: function () {
        Ext.dispatch({
            controller: FlyTalk.controllers.ftController,
            action: 'deletePanel',
            panel: this
        });
    },

/*
    refreshColumn: function () {
        this.notesList.refresh();
    }*/
});